.dutyDemonstration {
  width: 100%;
  .et-flex-column-center();

  .project-des {
    width: @content-width;
    padding: 40px 0 30px;

    img {
      width: 100%;
    }

    .prod-des-text {
      width: 100%;
      padding: 20px 0;
      line-height: 1.5;
      font-size: 20px;
      color: #333;
      text-align: justify;
      .et-flex-normal();

      &::before {
        content: "";
        width: 10px;
        height: 10px;
        margin: 10px 10px 10px 0;
        flex-shrink: 0;
        background-color: @primary-color;
      }

      span {
        flex: 1;
        word-break: break-all;
      }
    }
  }

  .server-des {
    width: 100%;
    background-color: #f7f6f5;
    .et-flex-column-center();

    .container {
      width: @content-width;
      .et-flex-column-center();

      .title {
        height: 45px;
        line-height: $height;
        font-size: 22px;
      }

      .server-main {
        width: 100%;
        .et-flex-column-normal();

        .server-item {
          width: 100%;
          padding-bottom: 40px;
          .et-flex-start();

          .server-icon {
            width: 76px;
            margin-right: 30px;

            img {
              width: 100%;
            }
          }

          .server-info {
            flex: 1;
            .et-flex-column-normal();

            .server-title {
              width: 100%;
              font-size: 24px;
              color: #333;
              padding-bottom: 20px;
            }

            .server-text {
              width: 100%;
              word-break: break-all;
              font-size: 18px;
              line-height: 1.5;
              color: #666;
            }
          }
        }
      }
    }
  }

  .project-title {
    width: 100%;
    padding: 80px 0;
    font-size: 48px;
    color: #f16f00;
    text-align: center;

    span {
      margin: 0 40px;
    }

    img {
      width: 46px;

      &.reverse {
        transform: rotate(180deg);
      }
    }
  }

  .highlight-server {
    width: 100%;
    padding-bottom: 40px;
    .et-flex-column-center();

    .container {
      width: @content-width;

      .highlight-main {
        width: 100%;
        .et-flex-start();

        .highlight-item {
          flex: 1;

          &:not(:last-child) {
            margin-right: 116px;
          }

          .et-flex-column-center();

          img {
            width: 177px;
            margin-bottom: 10px;
          }

          span {
            font-size: 20px;
            line-height: 1.5;
            color: #666;
            text-align: center;
          }
        }
      }
    }
  }

  .advantage-server {
    width: 100%;
    padding-bottom: 40px;
    background-color: #f7f6f5;
    .et-flex-column-center();

    .container {
      width: @content-width;

      .advantage-server-img {
        width: 100%;
      }
    }
  }

  .server-expample {
    width: 100%;
    padding-bottom: 40px;
    background-color: #f7f6f5;
    .et-flex-column-center();

    .container {
      width: @content-width;
      .et-flex-column-center();
      .server-expample-img {
        width: 949px;
      }
    }
  }
}